<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<script src="./js/index.global.js"></script>

		<script>

            let events = [
                {
                    title: '全天事件',
                    start: '2023-01-01'
                },
                {
                    title: '长期事件',
                    start: '2023-01-07',
                    end: '2023-01-10'
                },
                {
                    title: '点击跳转网页',
                    url: 'https://jsss-1.blog.csdn.net',
                    start: '2023-01-28'
                }
            ];
            document.addEventListener('DOMContentLoaded', function () {
                var calendarEl = document.getElementById('calendar');
                var calendar = new FullCalendar.Calendar(calendarEl, {
                    locale: 'zh', // 设置为中文
                    buttonText: {
                        today: '今天',
                        month: '月',
                        week: '周',
                        day: '日'
                    },
                    headerToolbar: {
                        left: 'prev,next today',
                        center: 'title',
                        right: 'dayGridMonth,timeGridWeek,timeGridDay'
                    },
                    initialDate: '2023-01-12',
                    navLinks: true, // can click day/week names to navigate views
                    selectable: true,
                    selectMirror: true,
                    select: function (arg) {
                        var title = prompt('事件标题:');
                        if (title) {
                            calendar.addEvent({
                                title: title,
                                start: arg.start,
                                end: arg.end,
                                allDay: arg.allDay
                            })
                        }
                        calendar.unselect()
                    },
                    eventClick: function (arg) {
                        if (confirm('你确定删除这个事件吗？')) {
                            arg.event.remove()
                        }
                    },
                    editable: true,
                    dayMaxEvents: true, // allow "more" link when too many events
                    events: events
                });

                calendar.render();
            });

		</script>


		<script>
            // 函数用于添加新事件对象到事件数组中
            function addEvent(title, start, end, url) {
                let newEvent = {
                    title: title,
                    start: start,
                    end: end,
                    url: url
                };
                events.push(newEvent);
            }

            // 调用函数添加新事件对象
            addEvent('New Event', '2023-02-15', '2023-02-17', 'http://example.com/');

            // 打印更新后的事件数组
            console.log(events);

		</script>

		<style>

            body {
                margin: 40px 10px;
                padding: 0;
                font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
                font-size: 14px;
            }

            #calendar {
                max-width: 1100px;
                margin: 0 auto;
            }

		</style>
	</head>
	<body>

		<div id="calendar"></div>

	</body>
</html>
